
<div class="paddingT15 paddingB15">
    <table style="width: 100%">
        <tr>
            <td>
                <table style="width: 100%;">
                    <tr>
                        <td colspan="2"><h3 style="margin: 0px">Information Général<div style="float:right;cursor: pointer" id="action-info-generale"><span  onclick="editInfoGenerale()" class="label label-info">Modifier</span></div></h3></td>
                    </tr>
                    <tr>
                        <td id="div-info-generale">
                            {% include 'GdsUserBundle:User:infoGenerale.html.twig' %}
                            </td>
                        </tr>
                    </table>
                </td>

                <td style="width: 25%;vertical-align: top;" >
                    <ul id="itemContainer" class="galleryView center">
                        <li class="animated fadeInUp">
                        {% if user.photo == null %}
                                <img id="photo-user" alt="Image name" data-original="/images/gallery/thumbnails/1.jpg" src="/uploads/user/photo/preload.png" style="width: 123px;">
                        {% else %}
                                <img id="photo-user" alt="{{user.nom}} {{user.prenom}}" data-original="/images/gallery/thumbnails/1.jpg" src="/uploads/user/photo/{{user.photo}}" style="width: 123px;">

                        {% endif %}
                                <div class="actionBtn" style="display: none;">
                                    
                                    <a class="edit" href="#">
                                        <input id="user_photo" type="text" />
                                    </a>
                                </div>
                            </li>
                        </ul>
                    </td>
                </tr>
                <tr>
                    <td>
                        <table style="width: 100%">
                            <tr>
                                <td colspan="2"><h3 style="margin: 0px">Mot de passe<div style="float:right;cursor: pointer" id="action-change-password"><span  onclick="editMotDePasse()" class="label label-info">Modifier</span></div></h3></td>
                            </tr>
                            <tr>
                                <td id="form-change-password" style="display: none">
                            {{ render (controller('GdsUserBundle:changePassword:changePassword')) }}
                                    </td>
                                </tr>
                            </table>
                        </td>
                        <td></td>
                    </tr>

                </table>

            </div>
            <script>
                                $('#user_photo').uploadify({
                                    
                                
                                    'width': 32,
                                    'height': 32,
                                    'uploader': '/uploadify/uploadify.swf',
                                    'script': '/uploadify/uploadify.php',
                                    'cancelImg': '/uploadify/cancel.png',
                                    'folder': '/uploads/user/photo',
                                    'fileExt': '*.png;*.jpg;*.jpeg;',
                                    'fileDesc': 'Images Files',
                                    'auto': true,
                                    'buttonImg': '/uploadify/pen.png',
                                    'onSelect': function(event, ID, fileObj) {
                                        $.ajax({
                                            url: '{{path('gds_user_photo')}}',
                                            data: 'id={{user.id}}'+'&photo='+fileObj.name,
                                            success: function(result){
                                             $('#photo-user').attr('src','/uploads/user/photo/'+result)
                                            }
                                        })
                                    }
                                });
                                $('#itemContainer').mouseover(function() {
                                    $('.actionBtn').show()
                                })
                                $('#itemContainer').mouseout(function() {
                                    $('.actionBtn').hide()
                                })
                                function editInfoGenerale() {
                                    $('#action-info-generale').html('<img style="width: 24px;" src="/images/loaders/horizontal/003.gif" />')
                                    $.ajax({
                                        url: '{{path('gds_user_edit_info_generale')}}',
                                        data: 'id={{user.id}}',
                                        success: function(result) {
                                            $('#action-info-generale').html('<span  onclick="saveInfoGenerale()" class="label label-info">Enregistrer</span><span onclick="annulerInfoGenerale()" class="by label">Annuler</span>')
                                            $('#div-info-generale').html(result)
                                        }
                                    })
                                }
                                function annulerInfoGenerale() {
                                    $('#action-info-generale').html('<img style="width: 24px;" src="/images/loaders/horizontal/003.gif" />')
                                    $.ajax({
                                        url: '{{path('gds_user_info_generale')}}',
                                        data: 'id={{user.id}}',
                                        success: function(result) {
                                            $('#action-info-generale').html('<span  onclick="editInfoGenerale()" class="label label-info">Modifier</span>')
                                            $('#div-info-generale').html(result)
                                        }
                                    })


                                }
                                function editMotDePasse() {
                                    $('#action-change-password').html('<span  onclick="saveMotDePasse()" class="label label-info">Enregistrer</span><span onclick="annulerMotDePasse()" class="by label">Annuler</span>')
                                    $('#form-change-password').show("slow")
                                }
                                function saveMotDePasse() {
                                    $('#action-change-password').html('<img style="width: 24px;" src="/images/loaders/horizontal/003.gif" />')
                                    $.ajax({
                                        type: 'post',
                                        dataType: 'json',
                                        url: '{{path('fos_user_change_password')}}',
                                        data: $('#form-password').serialize() + '&id={{user.id}}',
                                        success: function(result) {

                                            if (result.success == true) {
                                                $('#action-change-password').html('<span  onclick="editMotDePasse()" class="label label-info">Modifier</span></div>')
                                                $.pnotify({
                                                    type: 'success',
                                                    title: 'Changement effectué avec succés',
                                                    text: 'Votre changement de mot de passe est effectué avec succés',
                                                    icon: 'picon icon16 iconic-icon-check-alt white',
                                                    opacity: 0.95,
                                                    history: false,
                                                    sticker: false
                                                });
                                                resetForm('form-password')
                                                $('#form-change-password').hide()

                                            } else {
                                                $('#action-change-password').html('<span  onclick="saveMotDePasse()" class="label label-info">Enregistrer</span><span onclick="annulerMotDePasse()" class="by label">Annuler</span>')
                                                $('#form-change-password').html(result['contenu'])
                                            }
                                        }
                                    })
                                }
                                function annulerMotDePasse() {
                                    resetForm('form-password')
                                    $('#form-change-password').hide()
                                    $('#action-change-password').html('<span  onclick="editMotDePasse()" class="label label-info">Modifier</span></div>')
                                }
                                function resetForm(id) {
                                    $('#' + id).each(function() {
                                        this.reset();
                                    });
                                }
                </script>

